import React, { Component } from 'react'
import { Card, Button, message } from 'antd'
import './ui.less'
export default class Messages extends Component {
  handleMessage = (type) => {
    message[type]('恭喜你，React课程晋级成功.')
  }
  render() {
    return (
      <div>
        <Card title="全局提示框" className="card-wrap">
          <Button
            type="primary"
            className="btn-margin"
            onClick={() => {
              this.handleMessage('success')
            }}
          >
            success
          </Button>
          <Button
            type="primary"
            className="btn-margin"
            onClick={() => {
              this.handleMessage('info')
            }}
          >
            info
          </Button>
          <Button
            type="primary"
            className="btn-margin"
            onClick={() => {
              this.handleMessage('warning')
            }}
          >
            warning
          </Button>
          <Button
            type="primary"
            className="btn-margin"
            onClick={() => {
              this.handleMessage('error')
            }}
          >
            error
          </Button>
          <Button
            type="primary"
            className="btn-margin"
            onClick={() => {
              this.handleMessage('loading')
            }}
          >
            loading
          </Button>
        </Card>
      </div>
    )
  }
}
